<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>04_计算器</title>
</head>
<body>
<input type="text" placeholder="请输入数字1" id="i1">
<button onclick="f1('+')">+</button>
<button onclick="f1('-')">-</button>
<button onclick="f1('*')">×</button>
<button onclick="f1('/')">÷</button>
<input type="text" placeholder="请输入数字2" id="i2">
<h4>=<span></span></h4>
<script>
    function f1(o) {
        let i1 = document.getElementById('i1');
        let i2 = document.getElementById('i2');
        i1 = parseFloat(i1.value);
        i2 = parseFloat(i2.value);
        let spanE = document.querySelector('span');
        if (isNaN(i1) || isNaN(i2)) {
            spanE.innerHTML = '请输入有效的数字';
            return;
        }
        switch (o) {
            case '+':
                spanE.innerHTML = i1 + i2;
                break;
            case '-':
                spanE.innerHTML = i1 - i2;
                break;
            case '*':
                spanE.innerHTML = i1 * i2;
                break;
            case '/':
                if (i2 === 0) {
                    spanE.innerHTML = '除数不能为零';
                } else {
                    spanE.innerHTML = i1 / i2;
                }
                break;
            default:
                spanE.innerHTML = '未知的运算操作';
        }
    }
</script>
</body>
</html>